<template>
	<view class="content" >
		<image class="top-icon" src="../../static/receive/img-dizhi-132-biaoti@2x.png" mode="aspectFit"></image>
		<view class="box" v-for="(item,index) in addressList" :key="index">
			<view class="info">
				<view class="title">服务网点：</view>
				<view class="value">{{item.name}}</view>
			</view>
			<view class="info">
				<view class="title">地址：</view>
				<view class="value">{{item.address}}</view>
			</view>
			<view class="info">
				<view class="title">联系人：</view>
				<view class="value">{{item.people}}</view>
			</view>
			<view class="info">
				<view class="title">电话：</view>
				<view class="value">{{item.phone}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				addressList:[
					{
						name:"旅游咨询中心七宝老街分中心",
						address:"七宝镇青年路横沥路口",
						people: '张培',
						phone:"64610016  13774210725"
					},
					{
						name:"旅游咨询中心江川分中心",
						address:"江川路150号",
						people: '叶丽芳',
						phone:"34021116  13917634258"
					},{
						name:"旅游咨询中心郊野公园",
						address:"浦星公路2578弄8号浦江郊野公园一号门",
						people: '白玫',
						phone:"51516375  17317689932"
					}
				]
			};
		}
	}
</script>

<style lang="stylus">
	page{
		background-color #CEA175
		height 100%
		width 100%
	}

	.content{
		position relative
		background: #F9E5A1;
		box-shadow: 0 8rpx 14px 5rpx rgba(165,79,49,0.68), inset 0 2rpx 0 0 rgba(255,255,255,0.74), inset 0 -2rpx 1rpx 0 #E29F45;
		border-radius: 36rpx 36rpx 0 0;
		margin 50rpx auto 0 auto
		padding 100rpx 20rpx 20rpx 20rpx
		min-height 100%
		width 100%
		.top-icon{
			width 510rpx
			height 132rpx
			display block
			position absolute
			left 50%
			top -35rpx
			transform translateX(-50%)
		}
		.box{
			margin-top 20rpx
			background-image: linear-gradient(-180deg, #FDFFF7 0%, #FEFED9 100%);
			border: 1px solid #E8A974;
			border-radius: 23rpx;
			padding 30rpx
			font-family: PingFangSC-Semibold;
			font-size: 28rpx;
			color: #844425;
			letter-spacing: 0.14rpx;
			line-height 28rpx
			.info{
				display flex
				justify-content baseline
				padding 15rpx 0
				.title{
					width 160rpx
				}
				.value{
					width 510rpx
				}
			}
		}
	}
</style>
